<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <title>print_demo_topAndBottom</title>
    <!-- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> -->
    <!-- <link href="../themes/default/_css/umeditor.css" type="text/css" rel="stylesheet"> -->
	<style>
		body {
			background: #eee;
		}
		h1,h2,h3,h4,h5,h6 {
			margin: 0;
			padding: 0;
		}
		.root-container, .root-left-side, .root-right-side, .root-main {
			height: 1122px;
			margin: 0;
			padding: 0;
			background: white;
		}
		.root-container {
			width: 792px;   /* 792+2 */
			height: 1122px; /* 1122+2 */
			border-style: solid;
			border-width: 1px;
			border-color: #239;
			border-radius:3px;
			margin-left: auto;
			margin-right: auto;
		}
		.root-left-side , .root-right-side {
			background: #7a7;
		}
		.root-left-side {
			float: left;
			width: 56px;
		}
		.root-right-side {
			float: left;
			width: 56px;
		}
		.root-main, .main-top, .page-head, .page-head-center, .patient-register-info, .page-head-hr {
			width: 680px;
		}
		.root-main {
			float: left;
		}
		.main-top {
			height: 48px;
			background: #dff;
		}
		.page-head {
			height: 100px;
			background: #9df;
		}
		.page-head-center {
			text-align: center;
		}
		.page-head-title {
			font-family: 宋体;
			font-size: 18pt;
			font-weight: bold;
			letter-spacing: 0.1em;
			padding-top: 0.25em;
		}
		.page-head-subtitle {
			font-family: 宋体;
			font-size: 15.75pt;
			letter-spacing: 0.2em;
			padding-top: 0.25em;
		}
		.patient-register-info {
			font-family: 宋体;
			font-size: 10.5pt;
			padding-top: 0.5em;
		}
		.page-head-hr {
			height: 10px;
			border-bottom: 2px solid #222;
		}
		@media print{
			body {
				background: #fff;
				margin-top: 0;
				margin-bottom: 0;
			}
			.notShow {
				display: none;
			}
			.root-container {
				border-width: 0;
			}
			
		}
		@page {
			margin-top: 0;
			margin-bottom: 0;
		}
	</style>
	<script type="text/javascript" src="../third-party/jquery-1.10.2.min.js"></script>
</head>
<body>

<input class="notShow" type="button" id="printBtn" value="打印" onclick="runPrint();" />

<div class="root-container">
	<div class="root-left-side">
	</div>
	<div class="root-main">
		<div class="main-top"></div>
		<div class="page-head">
			<div class="page-head-center page-head-title">
				<span>人人康科技医院</span>
			</div>
			<div class="page-head-center page-head-subtitle">
				<span class="">入院记录</span>
			</div>
			<div class="patient-register-info">
				姓名: <span name="patientName">王思思</span><span style="margin:0 30px;"><span>性别: <span name="patientGender">女</span><span style="margin:0 30px;"><span>科别: <span name="keshi">外科</span><span style="margin:0 30px;"><span>床号: <span name="chuanghao">302</span><span style="margin:0 30px;"><span>病案号: <span name="chuanghao">20171224001</span>
			</div>
			<div class="page-head-hr"></div>
		</div>
		<!-- (1122) 48 + 100 +  -->
		<div class="page-body"></div>
		<div class="page-footer"></div>
	</div>
	<div class="root-right-side">
	</div>
</div>

<hr class="notShow">


<!-- 210mm * 297mm ，525px * 742.5px , 525 - 742.5  -->
<!-- <script type="text/plain" id="myEditor1" style="width:210mm;height:742.5px;"> -->
    <!-- <p>这里我可以写一些输入提示</p> -->
<!-- </script> -->

<!-- <input type="button" id="btn01" value="获取'myEditor1'的高度"/><br/> -->
<!-- <hr> -->

<script type="text/javascript">
    function runPrint(){
		window.print();
	}
</script>

</body>
</html>